<!DOCTYPE html>
<!--
Copyright 2013 The Polymer Authors. All rights reserved.
Use of this source code is governed by a BSD-style
license that can be found in the LICENSE file.
-->
<html>
  <head>
    <title>Native CustomElements callbacks</title>
    <meta charset="UTF-8">
  </head>
  <body>
    <x-foo></x-foo>
  
    <script>
      document.webkitRegister('x-foo', {
        prototype: Object.create(HTMLElement.prototype, {
          ready: { value: 0, writable: true},
          inserted: { value: 0, writable: true},
          removed: { value: 0, writable: true},
          isXFoo: {
            value: true
          },
          readyCallback: {
            value: function() {
              this.ready++;
            }
          },
          insertedCallback: {
            value: function() {
              this.inserted++;
            }
          },
          removedCallback: {
            value: function() {
              this.removed++;
            }
          }
        })
      });

      var xFoo = document.createElement('x-foo');
      document.body.appendChild(xFoo);

      Array.prototype.forEach.call(document.querySelectorAll('x-foo'),
        function(node) {
          node.remove();
          console.group();
          console.log('upgraded:', node.isXFoo);
          console.log('ready', node.ready, 'expected', 1);
          console.log('inserted', node.inserted, 'expected', 1);
          console.log('removed', node.removed, 'expected', 1);
          console.groupEnd();
        }
      );

    </script>
  </body>
</html>
